<template>
  <div id="app">
    <!-- getid是nav接收app传来的id -->
    <!-- changing是nav传送到app更新了的歌曲进度（与歌曲页的交互） -->
    <!-- xchange是在歌曲页改变了数据，传送到app再传到nav（与歌曲页的交互） -->
    <!-- v-bind:getidobj="songidobj"  -->
    <!-- addsonglist是接收app改变了的歌曲列表 -->
    <!-- <mynav v-show="isShowFooter" 

    v-on:changing="nsong"
    v-bind:xchange="mytime"

    v-bind:addsonglist="songlist"
    ></mynav>  -->
    <mynav v-show="isShowFooter" ></mynav>
<!--  -->
    <!-- 用一个值mytime记录改变的进度 -->
    <!-- send_other是其他页面传id到app的方法（其他页面与nav的交互）  -->
    <!-- send_song是歌曲页传更新了nowtime到app的方法（歌曲页与nav的交互） -->
    <!-- xsong 是歌曲页面接收实时更新app(nav传来)的数据（歌曲页与nav的交互） -->
    <!-- send_songlist是传送当前歌单的数据 -->
    <!-- get_allsong是歌曲详情页接收当前歌单的数据 -->
    <!-- <router-view 

    v-on:send_other="songid" 

    v-on:send_list="app_get_list"

    v-bind:get_allsong="songlist"

    v-on:send_song="time_change"
    v-bind:xsong="mytime"

    ></router-view> -->
    <router-view></router-view>
  </div>
</template>
<script>
import mynav from "./small/mynav.vue"
export default {
  name:"app",
  data(){
    return {
      load:false,
      isShowFooter:true,
      // moshi:0.循环播放，1单曲循环，2.随机播放
      // list1:当前歌单列表，
      // list2:历史播放列表
      // what:当前播放哪个歌单 0:list1，1:list2
      // which:播放当前歌单的哪首歌 
      songlist:{
        which:0,
        moshi:0,
        what:0,
        list1:[],
        list2:[]
      },
      sogid:0,
      mytime:{
        id:0,
        alltime:0,
        nowtime:0,
        status:false,
      },
    }
  },
  watch: {
		'$route' (to, from) { //监听路由是否变化
      this.isShowFooter = to.query.isshow
		},
    // 'mytime'(){
    //   // console.log(this.mytime)
    // },
    // "songlist.list2"(value){
    //   if(value !== undefined){
        // console.log('list2',this.songlist)
        // let arr = []
        // 处理数据,去除undefined
        // for(let j = 0;j<this.songlist.list2.length;j++){
        //     if(value[j] !== undefined){
        //         arr.push(value[j])
        //     }
        // }
        // this.songlist.list2 = arr
      // }
    // }
	},
  components:{
    mynav,
  },
  methods:{
    // 歌单页面传歌单列表歌曲到app
    // app_get_list(res){
    //   // console.log("app接收到的数据",res)
    //   if(res.list1 !== undefined){
    //     this.songlist.list1 = res.list1
    //   }
    //   // 是哪个歌单
    //   if(res.which !== undefined){
    //     this.songlist.which = res.which
    //     if(this.songlist.what === 0){
    //       this.mytime.id = this.songlist.list1[res.which]
    //     }else{
    //       this.mytime.id = this.songlist.list2[res.which]
    //     }
    //   }
    //   // 是什么模式
    //   if(res.moshi !== undefined){
    //     this.songlist.moshi = res.moshi
    //   }
    //   // 是哪个歌单
    //   if(res.what !== undefined){
    //     this.songlist.what = res.what
    //   }
    //   if(res.list2 !== undefined){
    //     this.songlist.list2 = res.list2
    //     if(res.list2_id !== undefined){
    //       for(let i = 0;i<res.list2.length;i++){
    //         if(res.list2_id === res.list2[i]){
    //           this.songlist.which = i
    //           this.mytime.id = res.list2[i]
    //         }
    //       }
    //     }
    //   }
    // },
    // 其他页面传id到app
    // songid(res){
    //   // console.log(111,res)
    //   if(res.id !== undefined){
    //     // 进行处理,改变id传到nav组件
    //     this.mytime.id = res.id
    //     // console.log(this.mytime.id)
    //     if(this.songlist.list2.length > 1){
    //       // let newarr = []
    //       let bbb = 0
    //       let nnn = 0
    //       for(let i = 0;i<this.songlist.list2.length;i++){
    //         if(res.id == this.songlist.list2[i]){
    //           bbb = 1
    //           nnn = i
    //         }
    //       }
    //       if(bbb == 0){
    //        this.songlist.list2.unshift(res.id)
    //       }else{
    //         this.songlist.which = nnn
    //       }
    //     }else{
    //       this.songlist.list2.unshift(res.id)
    //     }
    //     this.songlist.what = 1
    //     if(res.status !== undefined){
    //       this.mytime.status = res.status
    //     }
    //   }
    // },
    // 歌曲页改变进度条传值到app
    // time_change(res){
    //   // console.log("歌曲页面改变",res)
    //   this.mytime = res
    // },
    // // nav改变进度传值到app
    // nsong(res){
    //   // console.log(222,res)
    //   this.mytime = res
    // }
  }
}
</script>
<style lang="less">
.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #2c3e50;
  width: 100%;
  height: 100%;
  &::-webkit-scrollbar { width: 0 !important }
}
body,html{
  margin: 0;
  overflow-x: hidden;
  width: 100%;
  height: 100%;
  &::-webkit-scrollbar { width: 0 !important }
}
#nav {
  padding: 30px;

  a {
    font-weight: bold;
    color: #000;
    -webkit-tap-highlight-color:transparent; 
  }
}
.active{
  position: relative;
  .svgbox{
    svg{
      color:#5893e2;
    }
  }
  p{
      color:#5893e2;
  }
  &::after{
    position: absolute;
    top: 15%;
    right: 20%;
    content: '';
    border-radius: 50%;
    width: 1rem;
    z-index: 0;
    height: 1rem;
    background-color: rgba(120, 172, 241, 0.575);
  }
}
.bigting{
  &::after{
      content: '';
      width: 0px !important;
      height: 0px !important;
  }
}
img[lazy="loading"]{
  width: 100% !important;
  height: 100% !important;
}
</style>
